<template>
  <div class="content-wrapper">
    <!-- <div class="content-header">我的收藏</div> -->
    <div class="content-container">
      <div v-if="multipleSelection.length > 0" class="filter-container">
        <span class="filter-item filter-item-label">批量操作 </span>
        <el-button size="mini" round class="filter-item" @click="deleteAll"
          >取消收藏<i
            class="el-icon-delete el-icon--right button-icon danger-color"
        /></el-button>
      </div>
      <div>
        <!--<el-form :inline="true" :model="listQuery" class="filter-container">
          <el-form-item label="文档名称">
            <el-input v-model.trim="listQuery.documentName" placeholder="请输入文档名称" class="filter-item" />
          </el-form-item>
          <el-form-item>
            <el-button class="filter-item" size="small" round type="primary" icon="el-icon-search" @click="getList">搜索</el-button>
          </el-form-item>
        </el-form>-->
        <el-table
          height="500"
          v-loading="listLoading"
          :data="pageList"
          highlight-current-row
          style="width: 100%"
          @selection-change="handleSelectionChange"
        >
          <el-table-column type="selection" width="55" fixed />
          <el-table-column label="文档名称" min-width="200">
            <template slot-scope="scope">
              <svg class="icon" aria-hidden="true">
                <use
                  :xlink:href="iconType(scope.row.fileExtension).class"
                ></use>
              </svg>
              <!-- style="cursor: pointer" -->
              <span
                >{{ scope.row.documentName }}{{ scope.row.fileExtension }}</span
              >
            </template>
          </el-table-column>
          <el-table-column
            label="收藏时间"
            prop="createTimeString"
            width="160px"
          />
          <el-table-column label="文件状态" prop="status" width="160px">
            <template scope="{row}">
              <el-tag v-if="!row.documentNotExist" type="success">正常</el-tag>
              <el-tag v-else type="danger">已删除</el-tag>
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            align="center"
            width="150px"
            fixed="right"
          >
            <template slot-scope="scope">
              <el-dropdown trigger="click" class="filter-item">
                <el-button type="text" class="el-icon-more" />
                <el-dropdown-menu slot="dropdown" class="user-dropdown">
                  <el-dropdown-item
                    @click.native="toDocument(scope.row, 'view')"
                    >预览</el-dropdown-item
                  >
                  <el-dropdown-item @click.native="deleted(scope.row)"
                    >取消收藏</el-dropdown-item
                  >
                  <!-- <el-dropdown-item @click.native="deletedRecord(scope.row)"
                    >删除记录</el-dropdown-item
                  > -->
                </el-dropdown-menu>
              </el-dropdown>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <pagination
        v-show="total > 0"
        :total="total"
        :page-number.sync="listQuery.pageNumber"
        :page-size.sync="listQuery.pageSize"
        @pagination="getList"
      />
    </div>
    <DeleteTips
      :DeleteTipsData="DeleteTipsData"
      v-on:pushDeleteTipsData="pushDeleteTipsData"
    ></DeleteTips>
  </div>
</template>
<script>
import {
  pageDocumentFavorite,
  deleteDocumentFavorite,
  deleteDocumentFavoriteByIds
} from '@/api/xd/favorite'
import Pagination from '@/components/Pagination'
import { unity } from '@/styles/js/setIconType.js'
import DeleteTips from '@/components/DeleteTips/index'
import { favoriteDelete } from '@/api/fd/document.js'




export default {
  components: {
    Pagination,
    DeleteTips
  },
  data() {
    return {
      iconType: unity.setIconType,
      multipleSelection: [],
      listLoading: false,
      pageList: [],
      listQuery: {
        documentName: '',
        pageNumber: 1,
        pageIndex: 0,
        pageSize: 10
      },
      total: 0,
      DeleteTipsData: {}
    }
  },
  mounted() {
    this.getList()
  },
  methods: {
    handleSelectionChange(val) {
      console.log(val)
      this.multipleSelection = val
    },
    getList() {
      this.listLoading = true
      this.listQuery.pageIndex = this.listQuery.pageNumber - 1
      pageDocumentFavorite(this.listQuery).then((res) => {
        this.pageList = res.data.rows
        this.total = res.data.total
        this.listLoading = false
      })
    },
    deleted(row) {
      this.DeleteTipsData = {
        deleteDialog: true,
        type: 1,
        row: row,
        title: '取消收藏'
      }
    },
    pushDeleteTipsData(val) {
      if (val.type == 1) {
        deleteDocumentFavorite({
          documentFavoriteId: val.row.documentFavoriteId
        }).then((res) => {
          if (res.code === 1) {
            this.$message.success('取消成功')
            this.getList()
          }
        })
      } else if (val.type == 2) {
        deleteDocumentFavoriteByIds(val.row).then((res) => {
          if (res.code === 1) {
            this.$message.success('取消成功')
            this.getList()
          }
        })
      }
    },
    deleteAll() {
      if (this.multipleSelection.length > 0) {
        var ids = []
        for (var i in this.multipleSelection) {
          ids.push(parseInt(this.multipleSelection[i].documentFavoriteId))
        }
        this.DeleteTipsData = {
          deleteDialog: true,
          type: 2,
          row: ids,
          title: '取消收藏'
        }
      } else {
        this.$message.error('请选择后操作')
      }
    },
    toDocument(data, mode) {
      console.log(data, 'data')
      window.open(
        'onlyoffice/createDocument.html?&token=' +
          this.$store.getters.token +
          '&documentId=' +
          data.documentId +
          '&mode=' +
          mode +
          '&urldata=' +
          process.env.VUE_APP_BASE_API
      )
    },
    deletedRecord(row) {
      console.log(row,'sssseweeew');
      // 分享源文件被删除
      if (row.documentNotExist) {
        this.$message.info('当前分享的源数据已经被删除')
        favoriteDelete({
          documentFavoriteId: row.documentFavoriteId
        }).then(() => {
          this.getList()
        })
        return
      }
    }
  }
}
</script>
